<template>
  <div>
    <!-- 头部 -->
    <ul class="my-order">
      <li @click="MyHandle">＜</li>
      <li>我的订单</li>
      <li class="iconfont">&#xe65a;</li>
    </ul>

    <div class="subject" >
      <div ><router-link to="/all">全部</router-link></div>
      <div><router-link to="/pay">待支付</router-link></div>
      <div><router-link to="/money">待收货</router-link></div>
      <div><router-link to="/good">待评价</router-link></div>
    </div>

    <router-view />
  </div>
</template>

<script>
export default {
  name: "L-whole",
  data(){
      return{
        
      }
  },
  methods: {
    MyHandle() {
      this.$router.push("/usmine");
    },
   
  },
};
</script>

<style scoped>
.my-order {
  width: 375px;
  height: 44px;
  position: relative;
}
.my-order li {
  font-size: 18px;
}

.my-order > li:nth-child(1) {
  float: left;
  margin-left: 18px;
  margin-top: 11px;
}

.my-order > li:nth-child(2) {
  position: absolute;
  left: 150px;
  margin-left: 18px;
  margin-top: 11px;
  float: left;
}
.my-order > li:nth-child(3) {
  font-size: 30px;

  float: right;
  position: absolute;
  right: -12px;
}
.subject {
  display: flex;
}

.subject div {
  flex: 1;
  text-align: center;

  margin-top: 14px;
}
a {
  text-decoration: none;
  color: black;
}
.router-link-active{
 color:red
}
</style>